
<!--
 * @Author: your name
 * @Date: 2020-01-27 17:43:51
 * @LastEditTime: 2020-06-28 10:13:24
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \vue-element-admin\src\views\dashboard\admin\index.vue
 -->
<template>
  <div class="container" :style="{height:this.tabHeight}">
    <div class="totalInfo">
      <div class="buttons">
        <el-button icon="el-icon-camera" @click="changMapType1"></el-button>
        <el-button icon="el-icon-camera-solid" @click="changMapType2"></el-button>
        <!-- <el-button icon="el-icon-delete"></el-button>-->
        <el-dropdown @command="handleClick">
          <el-button type="primary" style="width:200px">
            更多菜单
            <i class="el-icon-arrow-down el-icon--right"></i>
          </el-button>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item command="yinhuan">隐患</el-dropdown-item>
            <el-dropdown-item command="enterprise">下属企业</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </div>
      <div>
        <el-collapse accordion value="1">
          <el-collapse-item name="1" title="总体概况">
            <div class="introduction">
              <div class="introduction-mess">
                <div
                  style="line-height: 25px;margin-left: 15px;margin-right: 10px;margin-top: 10px;"
                >
                  共包括隐患
                  <span style="color:#4C8FF5">{{this.mainData.totalTrouble}}</span>个。
                </div>
                <div style="line-height: 25px;margin-left: 15px;">其中：</div>
                <div style="line-height: 25px;margin-left: 15px;margin-right: 10px;color: gray">
                  重大隐患
                  <span style="color:#FC690C">{{this.mainData.stopRectify}}</span>个，较大隐患
                  <span style="color:#FC690C">{{this.mainData.limitRectify}}</span>个，一般隐患
                  <span style="color:#FC690C">{{this.mainData.nowRectify}}</span>个。
                </div>
              </div>
            </div>
          </el-collapse-item>
        </el-collapse>
      </div>
    </div>

    <!-- <div class="symbolInfo">
      <div class="ex-title">【总计:20个】</div>
      <img src="/Content/images/map/ex-hiddendanger.png" />
      <div class="ex-onetitle">红:0个</div>
      <div class="ex-twotitle">橙:0个</div>
      <div class="ex-threetitle">黄:0个</div>
      <div class="ex-fourtitle">蓝:1个</div>
    </div>-->
    <div class="symbolInfo">
      <div class="ex-title">【总计:{{this.mainData.totalTrouble}}个】</div>
    </div>
    <baidu-map
      class="map"
      :center="center"
      @ready="map_handler"
      :zoom="zoom"
      ak="bDzyj9G6pcbKEum8OHbPrTnhNV3kzg9x"
    ></baidu-map>
    <el-dialog title="隐患列表" :visible.sync="dialogDangerVisible">
      <div class="danger-container">
        <div class="filter-container">
          <el-input
            v-model="listQuery.taskName"
            placeholder="任务名称"
            style="width: 200px"
            clearable
            class="filter-item"
          ></el-input>
          <el-select
            v-model="listQuery.dangerLevel"
            placeholder="隐患级别"
            clearable
            style="width:130px"
            class="filter-item"
          >
            <el-option
              v-for="item in troubleGrades"
              :key="item.id"
              :label="item.dictValue"
              :value="item.id"
            />
          </el-select>
          <el-select
            v-model="listQuery.dangerRecitfyType"
            placeholder="整改类型"
            clearable
            class="filter-item"
            style="width: 130px"
          >
            <el-option
              v-for="item in troubleRectifyTypes"
              :key="item.id"
              :label="item.dictValue"
              :value="item.id"
            />
          </el-select>
          <el-button
            class="filter-item"
            type="primary"
            icon="el-icon-search"
            @click="handleFilter"
          >查询</el-button>
        </div>
        <el-table
          v-loading="listLoading"
          :data="list"
          border
          fit
          highlight-current-row
          style="width: 100%"
        >
          <el-table-column align="center" label="编号" min-width="60" prop="id"></el-table-column>
          <!-- <el-table-column type="index" label="序号" width="60" align="center"></el-table-column> -->
          <el-table-column min-width="200px" align="center" label="隐患名称" prop="dangerName"></el-table-column>
          <el-table-column min-width="200px" align="center" label="所属任务" prop="taskName"></el-table-column>
          <el-table-column min-width="200px" align="center" label="所属单位" prop="companyName"></el-table-column>

          <el-table-column min-width="100px" align="center" label="隐患级别" prop="dangerLevel">
            <template slot-scope="{row}">{{row.dangerLevel | levelFilter}}</template>
          </el-table-column>

          <el-table-column min-width="100px" align="center" label="整改类型">
            <template slot-scope="{row}">{{row.dangerRecitfyType|typeFilter}}</template>
          </el-table-column>
          <!-- <el-table-column min-width="100px" align="center" label="任务状态">
        <template slot-scope="{row}">{{row.taskState}}</template>
          </el-table-column>-->
          <el-table-column min-width="100px" align="center" label="隐患状态">
            <template slot-scope="{row}">{{row.dangerState|stateFilter}}</template>
          </el-table-column>

          <el-table-column class-name="status-col" label="发现人" width="100px" prop="discoverPerson"></el-table-column>
          <el-table-column class-name="status-col" label="发现时间" width="100px" prop="discoverDate"></el-table-column>
          <el-table-column class-name="status-col" label="发布时间" width="100px" prop="createTime"></el-table-column>
          <el-table-column
            class-name="status-col"
            label="整改限期"
            width="100px"
            prop="recitfyOverdate"
          ></el-table-column>

          <el-table-column align="center" label="操作" width="100px" fixed="right">
            <template slot-scope="scope">
              <!-- <router-link :to="'troubleDetail/'+scope.row.id"> -->
              <el-button size="small" icon="el-icon-view" @click="watchTroubleById(scope.row.id)">查看</el-button>
              <!-- </router-link> -->
              <!-- <router-link
                :to="'troubleEdit/'+scope.row.id"
                v-if="scope.row.dangerState==1&&scope.row.taskState!=99"
              >
                <el-button size="small" icon="el-icon-edit" type="primary">编辑</el-button>
              </router-link>
              <router-link
                :to="'troubleCheck/'+scope.row.id"
                v-if="scope.row.dangerState==4||scope.row.dangerState==5"
              >
                <el-button type="success" size="small" icon="el-icon-edit">复查</el-button>
              </router-link>
              <el-button
                v-if="scope.row.dangerState==1"
                type="danger"
                size="small"
                @click="deleteTroubleById(scope.row.id)"
                icon="el-icon-close"
              >删除</el-button>-->
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-show="total>0"
          :total="total"
          :page.sync="listQuery.pageIndex"
          :limit.sync="listQuery.limit"
          @pagination="getList"
        />
      </div>
    </el-dialog>
    <el-dialog title="隐患详情" :visible.sync="dialogDangerDetailVisible">
      <div class="dangerDetail_container">
        <el-form class="form-container">
          <div class="createPost-main-container">
            <fieldset class="fieldInfo">
              <legend>
                <span>隐患基本信息</span>
              </legend>
              <div class="createPost-main-container baseInfo">
                <el-row>
                  <el-col :span="24">
                    <div class="postInfo-container">
                      <el-row>
                        <el-col :span="12">
                          <el-form-item
                            label-width="115px"
                            label="所属公司:"
                            class="postInfo-container-item"
                          >{{this.troubleDetail.companyName}}</el-form-item>
                        </el-col>
                        <el-col :span="12">
                          <el-form-item
                            label-width="115px"
                            label="隐患级别:"
                            class="postInfo-container-item"
                          >{{this.troubleDetail.strDangerLevel}}</el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="12">
                          <el-form-item
                            label-width="115px"
                            label="发现日期:"
                            class="postInfo-container-item"
                          >{{this.troubleDetail.discoverDate}}</el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="24">
                          <el-form-item
                            label-width="115px"
                            label="隐患描述:"
                            class="postInfo-container-item contentLength"
                          >{{this.troubleDetail.dangerContent}}</el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="24">
                          <el-form-item
                            label-width="115px"
                            label="隐患照片:"
                            class="postInfo-container-item"
                          >
                            <ele-gallery
                              :source="this.troubleDetail.dangerAppendixObjs"
                              :height="100"
                              :width="100"
                            ></ele-gallery>
                          </el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="12">
                          <el-form-item
                            label-width="115px"
                            label="整改类型:"
                            class="postInfo-container-item"
                          >{{this.troubleDetail.strdangerRecitfyType}}</el-form-item>
                        </el-col>
                        <el-col :span="12">
                          <el-form-item
                            label-width="115px"
                            :label="this.troubleDetail.dangerRecitfyType==2?'整改期限':'整改时间'"
                            class="postInfo-container-item"
                          >{{this.troubleDetail.recitfyOverdate}}</el-form-item>
                        </el-col>
                      </el-row>
                      <el-row>
                        <el-col :span="24">
                          <el-form-item
                            label-width="115px"
                            label="整改要求:"
                            class="postInfo-container-item contentLength"
                          >{{this.troubleDetail.recitfyRequirement}}</el-form-item>
                        </el-col>
                      </el-row>
                    </div>
                  </el-col>
                </el-row>
              </div>
            </fieldset>
            <fieldset class="fieldInfo">
              <legend>
                <span>整改/复查情况表</span>
              </legend>
              <div style="overflow:auto;">
                <ul
                  style="list-style-type:none;"
                  v-if="this.troubleDetail.rectifyAndReview&&this.troubleDetail.rectifyAndReview.length>0"
                >
                  <li v-for="(item,index) in this.troubleDetail.rectifyAndReview" :key="index">
                    <div v-if="item.type==1">
                      <!-- 整改详情 -->
                      <div class="createPost-main-container listInfo">
                        <el-row>
                          <el-col :span="24">
                            <div class="postInfo-container cardBg">
                              <el-row>
                                <el-col :span="12">
                                  <el-form-item
                                    label-width="115px"
                                    label="整改人:"
                                    class="postInfo-container-item"
                                  >{{item.companyDangerRectify.recitfyPerson}}</el-form-item>
                                </el-col>
                                <el-col :span="12">
                                  <el-form-item
                                    label-width="115px"
                                    label="整改日期:"
                                    class="postInfo-container-item"
                                  >{{item.companyDangerRectify.recitfyDate}}</el-form-item>
                                </el-col>
                              </el-row>
                              <el-row>
                                <el-col :span="24">
                                  <el-form-item
                                    label-width="115px"
                                    label="整改后照片:"
                                    class="postInfo-container-item"
                                  >
                                    <ele-gallery
                                      :source="handlePics2(item.companyDangerRectify.recitfyAppendixObjs)"
                                      :height="75"
                                      :width="75"
                                    ></ele-gallery>
                                  </el-form-item>
                                </el-col>
                              </el-row>
                              <el-row>
                                <el-col :span="24">
                                  <el-form-item
                                    label-width="115px"
                                    label="整改内容:"
                                    class="postInfo-container-item contentLength"
                                  >{{item.companyDangerRectify.recitfyContent}}</el-form-item>
                                </el-col>
                              </el-row>
                            </div>
                          </el-col>
                        </el-row>
                      </div>
                    </div>

                    <div v-else>
                      <!-- 复查详情 -->
                      <!-- <el-form class="form-container"> -->
                      <div class="createPost-main-container listInfo">
                        <el-row>
                          <el-col :span="24">
                            <div class="postInfo-container cardBg">
                              <el-row>
                                <el-col :span="12">
                                  <el-form-item
                                    label-width="115px"
                                    label="复查人:"
                                    class="postInfo-container-item"
                                  >{{item.companyDangerReview.reviewPerson}}</el-form-item>
                                </el-col>
                                <el-col :span="12">
                                  <el-form-item
                                    label-width="115px"
                                    label="复查日期:"
                                    class="postInfo-container-item"
                                  >{{item.companyDangerReview.reviewDate}}</el-form-item>
                                </el-col>
                              </el-row>
                              <el-row>
                                <el-col :span="24">
                                  <el-form-item
                                    label-width="115px"
                                    label="复查照片:"
                                    class="postInfo-container-item"
                                  >
                                    <ele-gallery
                                      :source="handlePics2(item.companyDangerReview.reviewAppendixObjs)"
                                      :height="75"
                                      :width="75"
                                    ></ele-gallery>
                                  </el-form-item>
                                </el-col>
                              </el-row>
                              <el-row>
                                <el-col :span="24">
                                  <el-form-item
                                    label-width="115px"
                                    label="复查内容:"
                                    class="postInfo-container-item contentLength"
                                  >{{item.companyDangerReview.reviewContent}}</el-form-item>
                                </el-col>
                              </el-row>
                            </div>
                          </el-col>
                        </el-row>
                      </div>
                      <!-- </el-form> -->
                    </div>
                    <el-divider></el-divider>
                  </li>
                </ul>
                <p v-else style="text-align:center">尚无数据显示</p>
              </div>
            </fieldset>
          </div>
        </el-form>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  fetchTroubleAllInfo,
  fetchUnaccomplishedTask,
  fetchAccomplishedTask,
  fetchToBeReviewDanger,
  fetchUnRectifyDanger
} from '@/api/dashboard'
import EleGallery from 'vue-ele-gallery'
import { fetchList } from '@/api/troubles'
import Pagination from '@/components/Pagination'
import { getBaseDicInfo } from '@/api/baseApi'
import { fetchEnterpriseDangerList, fetchTroubleDetail } from '@/api/troubles'
import {
  fetchList as fetchEnterpriseList,
  fetchEnterpriseById
} from '@/api/enterprise'
import BaiduMap from 'vue-baidu-map/components/map/Map.vue'
// import BmMarker from 'vue-baidu-map/components/overlays/Marker'
let that = ''
export default {
  name: 'Map',
  components: {
    BaiduMap,
    Pagination,
    EleGallery
  },
  data() {
    return {
      troubleDetail: {},
      currentEnterpriseDetail: '', //企业详情
      list: null,
      total: 0,
      listLoading: false,
      listQuery: {
        taskName: '',
        pageIndex: 1,
        limit: 10,
        companyId: '',
        dangerName: '', //隐患名称
        dangerLevel: '', //隐患级别
        dangerRecitfyType: null, //隐患整改类型
        dangerState: null, //状态
        pType: 10 //查询人员类型
      },
      dialogDangerVisible: false,
      dialogDangerDetailVisible: false,
      BMap: '',
      map: '',
      tabHeight: `${document.body.clientHeight}px`,
      center: { lng: 106.602487, lat: 29.429754 }, //baidu地图
      zoom: 15, //baidu地图
      mainData: {
        totalTrouble: 0, //总隐患
        nowRectify: 0, //立即整改
        limitRectify: 0, //限期整改
        stopRectify: 0 //停工整改
      },
      troubleGrades: [], //隐患级别
      troubleRectifyTypes: [], //整改类型
      unaccomplishedTaskList: [],
      accomplishedTaskList: [],
      toBeReviewDangerList: [],
      unRectifyDangerList: [],
      companys: [],
      companyDangers: []
      // total: 0,
      // unaccomplishedTaskListLoading: true,
      // accomplishedTaskListLoading: true,
      // toBeReviewDangerListLoading: true,
      // unRectifyDangerListLoading: true
      // listQuery: {
      //   pageIndex: 1,
      //   limit: 10,
      //   pType: 2
      // }
    }
  },
  watch: {
    tabHeight(nval, oval) {
      return nval
    }
  },
  created() {
    that = this
    //获取所有得隐患统计信息
    this.getTroubleAllInfo()
    // if (checkPermission(['admin'])) {
    this.getUnaccomplishedTask()
    this.getAccomplishedTask()
    // }
    this.getToBeReviewDanger()
    this.getUnRectifyDanger()

    this.getTroubleGradesList()
    this.getRectifyTypeList()
  },
  mounted() {
    window.addEventListener('resize', this.resizeImage)
    // window.document.addEventListener('DOMMouseScroll', this.scrollFunc, false)
  },

  beforeDestroy() {
    window.removeEventListener('resize', this.resizeImage)
  },
  filters: {
    stateFilter(state) {
      const stateMap = {
        1: '草稿',
        2: '待整改',
        3: '整改中',
        4: '待复查',
        5: '复查不通过',
        6: '已消除'
      }
      return stateMap[state]
    },
    typeFilter(typeId) {
      let result = ''
      that.troubleRectifyTypes.map((type) => {
        if (type.id == typeId) {
          result = type.dictValue
        }
      })
      return result
    },

    levelFilter(levelId) {
      let result = ''
      that.troubleGrades.map((level) => {
        if (level.id == levelId) {
          result = level.dictValue
        }
      })
      return result
    }
  },
  methods: {
    handlePics2(pics) {
      return pics.map((p) => {
        return {
          title: p.name,
          src: `/api${p.url}`
        }
      })
    },
    watchTroubleById(id) {
      //显示隐患详情
      fetchTroubleDetail({
        dangerId: id,
        pType: 2
      }).then((response) => {
        if (response.code == 20000) {
          this.troubleDetail = response.data
          // console.log('***********', this.troubleDetail)
          this.troubleDetail.dangerAppendixObjs = this.troubleDetail.dangerAppendixObjs.map(
            (obj) => {
              return {
                id: obj.id,
                title: obj.name,
                // src: path.join('/api/image', obj.url)
                src: `/api${obj.url}`
              }
            }
          )
          console.log(this.troubleDetail)
          this.dialogDangerDetailVisible = true
        }
      })
    },
    handleClick(command) {
      if (command == 'yinhuan') {
        // console.log('command-------', command)
        this.getEnterpriseDangerList(command)
      } else if (command == 'enterprise') {
        // console.log('command-------', command)
        this.getEnterpriseList(command)
      }
    },
    map_handler({ BMap, map }) {
      // console.log('overlay--------', map.addOverlay)
      // console.log('BMap--------', BMap)
      // console.log('map--------', map)
      this.BMap = BMap
      this.map = map

      map.enableScrollWheelZoom(true) //允许地图随滚轮缩放
      this.getEnterpriseDangerList('yinhuan') //map准备好之后默认显示企业隐患标识
      //地图准备好后，转换企业地址将其进行定位
      // const myGeo = new this.BMap.Geocoder()
    },
    bdGEO(companys, command) {
      if (companys.length > 0) {
        for (let company of companys) {
          // console.log(company.lngandlat)
          if (company.lngandlat) {
            let lng = company.lngandlat.split(',')[0]
            let lat = company.lngandlat.split(',')[1]
            let point = new this.BMap.Point(lng, lat)
            setTimeout(this.addMarker(point, company, command), 600)
          }
        }
      }
    },
    addMarker(point, company, command) {
      let myicon = ''
      if (command == 'enterprise') {
        myicon = new this.BMap.Icon(
          require('@/assets/images/yinhuan_company.png'), // 百度图片
          new this.BMap.Size(25, 25), // 视窗大小
          {
            imageSize: new this.BMap.Size(25, 25) // 引用图片实际大小
          }
        )
      } else {
        if (company.dangerLevel == 4) {
          //一般隐患
          myicon = new this.BMap.Icon(
            require('@/assets/images/yinhuan_normal.png'), // 百度图片
            new this.BMap.Size(25, 25), // 视窗大小
            {
              imageSize: new this.BMap.Size(25, 25) // 引用图片实际大小
            }
          )
        } else if (company.dangerLevel == 5) {
          //较大隐患
          // 'http://images.fire.zshawk.cn/yinhuan_normal.png', // 百度图片
          myicon = new this.BMap.Icon(
            require('@/assets/images/yinhuan_bigger.png'), // 百度图片
            new this.BMap.Size(25, 25), // 视窗大小
            {
              imageSize: new this.BMap.Size(25, 25) // 引用图片实际大小
            }
          )
        } else if (company.dangerLevel == 6) {
          //重大隐患
          myicon = new this.BMap.Icon(
            require('@/assets/images/yinhuan_biggest.png'), // 百度图片
            new this.BMap.Size(25, 25), // 视窗大小
            {
              imageSize: new this.BMap.Size(25, 25) // 引用图片实际大小
            }
          )
        }
      }
      let marker = ''
      if (command == 'enterprise') {
        marker = new this.BMap.Marker(point, { icon: myicon })
        marker.companyId = company.companyId

        marker.addEventListener('click', async function() {
          try {
            let currentEnterpriseDetail = await that.getEnterpriseDetail(
              marker.companyId
            )
            // console.log('currentEnterpriseDetail', currentEnterpriseDetail)
            let sContent = `<div id='enterpriseInfo'><h4 style='margin:0 0 5px 0;padding:0.2em 0'>${
              currentEnterpriseDetail.companyName
            }</h4>
          <p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>企业地址:${
            currentEnterpriseDetail.companyRealAddress
          }</p>
          <p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>安全负责人:${currentEnterpriseDetail.managerOfficerName ||
            '无'}</p>
          <p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>安全负责人电话:${currentEnterpriseDetail.managerOfficerPhone ||
            '无'}</p>
          <p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>监管负责人:${currentEnterpriseDetail.safetyOfficerName ||
            '无'}</p>
          <p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>监管负责人电话:${currentEnterpriseDetail.safetyOfficerPhone ||
            '无'}</p>
          </div>`
            let opts = {
              width: 120, // 信息窗口宽度
              height: 160 // 信息窗口高度
            }
            let infoWindow = new that.BMap.InfoWindow(sContent, opts)
            this.openInfoWindow(infoWindow)
            //图片加载完毕重绘infowindow
            document.getElementById('enterpriseInfo').onload = function() {
              infoWindow.redraw() //防止在网速较慢，图片未加载时，生成的信息框高度比图片的总高度小，导致图片部分被隐藏
            }
          } catch (error) {
            console.log(error)
          }
        })
      } else {
        marker = new this.BMap.Marker(point, { icon: myicon })
        marker.companyId = company.companyId
        marker.addEventListener('click', function() {
          that.listQuery.companyId = marker.companyId
          that.listQuery.taskName = ''
          that.listQuery.dangerLevel = ''
          that.listQuery.dangerRecitfyType = ''
          that.getList(that.listQuery)
          that.dialogDangerVisible = true
        })
      }

      this.map.addOverlay(marker)
      marker.setLabel(
        new that.BMap.Label('企业:' + company.companyName, {
          offset: new that.BMap.Size(20, -10)
        })
      )
    },
    getTroubleAllInfo() {
      fetchTroubleAllInfo()
        .then((response) => {
          if (response.code == '20000') {
            this.mainData.nowRectify = response.data['1']
            this.mainData.limitRectify = response.data['2']
            this.mainData.stopRectify = response.data['3']
            this.mainData.totalTrouble =
              Number(response.data['1']) +
              Number(response.data['2']) +
              Number(response.data['3'])
          }
        })
        .catch((err) => {
          console.log(err)
        })
    },
    getUnaccomplishedTask() {
      fetchUnaccomplishedTask()
        .then((response) => {
          if (response.code == '20000') {
            this.unaccomplishedTaskList = response.data
          }
          this.unaccomplishedTaskListLoading = false
        })
        .catch((err) => {
          console.log(err)
        })
    },
    getAccomplishedTask() {
      fetchAccomplishedTask()
        .then((response) => {
          if (response.code == '20000') {
            this.accomplishedTaskList = response.data
          }
          this.accomplishedTaskListLoading = false
        })
        .catch((err) => {
          console.log(err)
        })
    },
    getToBeReviewDanger() {
      fetchToBeReviewDanger()
        .then((response) => {
          if (response.code == '20000') {
            this.toBeReviewDangerList = response.data
          }
          this.toBeReviewDangerListLoading = false
        })
        .catch((err) => {
          console.log(err)
        })
    },
    getUnRectifyDanger() {
      let ptype = 2
      // if (checkPermission(['safeManager', 'legalPerson'])) {
      //   ptype = 1
      // }
      fetchUnRectifyDanger({ ptype })
        .then((response) => {
          if (response.code == '20000') {
            this.unRectifyDangerList = response.data
          }
          this.unRectifyDangerListLoading = false
        })
        .catch((err) => {
          console.log(err)
        })
    },
    resizeImage() {
      this.tabHeight = `${document.body.clientHeight}px`
    },
    getEnterpriseList(command) {
      fetchEnterpriseList({
        pageIndex: 1,
        limit: 1000
      }).then((res) => {
        if (res.code == 20000) {
          this.companys = res.data.records
          this.map.clearOverlays()
          this.bdGEO(this.companys, command)
        }
      })
    },
    getEnterpriseDangerList(command) {
      fetchEnterpriseDangerList().then((res) => {
        if (res.code == 20000) {
          this.companyDangers = res.data
          this.map.clearOverlays()
          this.bdGEO(this.companyDangers, command)
        }
      })
    },
    getList(listQuery) {
      this.listLoading = true
      fetchList(listQuery).then((response) => {
        if (response.code == 20000) {
          this.list = response.data.records
          this.total = response.data.total
          this.listLoading = false
        }
      })
    },
    getEnterpriseDetail(id) {
      return fetchEnterpriseById(id).then((response) => {
        if (response.code == 20000) {
          return response.data
        } else {
          return new Error('未获取到数据')
        }
      })
    },
    getTroubleGradesList() {
      getBaseDicInfo({ typeId: 2 }).then((response) => {
        this.troubleGrades = response.data
      })
    },
    getRectifyTypeList() {
      getBaseDicInfo({ typeId: 1 }).then((response) => {
        this.troubleRectifyTypes = response.data
      })
    },
    handleFilter() {
      this.getList(this.listQuery)
    },
    changMapType1(type) {
      // eslint-disable-next-line no-undef
      this.map.setMapType(BMAP_NORMAL_MAP)
    },
    changMapType2(type) {
      // eslint-disable-next-line no-undef
      this.map.setMapType(BMAP_HYBRID_MAP)
    }
  }
}
</script>

<style lang="scss" scoped>
.danger-container /deep/ .pagination-container {
  margin-top: 0;
  padding: 16px 16px;
}
.container /deep/ .el-collapse-item__header {
  color: #fff;
  background-color: #1890ff;
  border-color: #1890ff;
  border-radius: 5px;
  padding-left: 20px;
  font-size: 16px;
  text-overflow: inherit;
  // font-weight: bolder;
}
.container /deep/ .el-collapse-item__header:focus {
  color: #fff;
}
.container /deep/ .el-collapse-item__header:hover {
  background: #46a6ff;
  color: #fff;
}

.map {
  width: 100%;
  height: 100%;
}

.container {
  position: relative;
}
.totalInfo {
  position: absolute;
  z-index: 999;
  top: 10px;
  left: 20px;
  width: 350px;
  .buttons {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 15px;
  }
}
.symbolInfo {
  position: absolute;
  z-index: 999;
  bottom: 20px;
  right: 20px;
  width: 182px;
  height: 115px;
  background-image: url('~@/assets/images/dangerSymbol2.png');
  background-repeat: no-repeat;
  background-size: 182px 115px;
  .ex-title {
    position: absolute;
    top: 10px;
    right: 5px;
  }
}
.fieldInfo {
  border-color: #eee;
  border-width: 1px;
  border-style: solid;
  margin-bottom: 20px;
  legend {
    color: #666;
  }
}
</style>
